<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>hello vue</title>
    <link rel="stylesheet" href="./assets/css/bootstrap.css">
    <script src="./assets/js/jquery.js"></script>
    <script src="./assets/js/bootstrap.js"></script>
    <script src="./assets/js/vue.js"></script>
</head>

<body>
    <h1 style="text-align:center">Vue2</h1>
    <hr>
    <div class="container">
        <h3>Vue 内部指令</h3>
        <ul class="list-group">
            <li class="list-group-item"><a href="./example/helloworld.html" target="_blank">Hello World </a></li>
            <li class="list-group-item"><a href="./example/v-if.html" target="_blank">v-if&v-show&v-else</a></li>
            <li class="list-group-item"><a href="./example/v-for.html" target="_blank">v-for </a></li>
            <li class="list-group-item"><a href="./example/v-text.html" target="_blank">v-text & v-html </a></li>
            <li class="list-group-item"><a href="./example/v-on.html" target="_blank">v-on 监听事件 </a></li>
            <li class="list-group-item"><a href="./example/v-model.html" target="_blank">v-model 绑定数据源 </a></li>
            <li class="list-group-item"><a href="./example/v-bind.html" target="_blank">v-bind </a></li>
            <li class="list-group-item"><a href="./example/others.html" target="_blank">其它内部指令 v-pre & v-cloak & v-once</a></li>
        </ul>
        <hr>
        <h3>Vue全局AIP</h3>
        <ul class="list-group">
            <li class="list-group-item"><a href="./example/vue.directive.html" target="_blank">Vue.directive 自定义指令</a></li>
            <li class="list-group-item"><a href="./example/vue.extend.html" target="_blank">Vue.extend 构造器延伸</a></li>
            <li class="list-group-item"><a href="./example/vue.set.html" target="_blank">Vue.set 全局操作</a></li>
            <li class="list-group-item"><a href="./example/shengmingzhouqi.html" target="_blank">构造器的生命周期</a></li>
            <li class="list-group-item"><a href="./example/template.html" target="_blank">Template 模板的写法</a></li>
            <li class="list-group-item"><a href="./example/component-1.html" target="_blank">component:组件-1</a></li>
            <li class="list-group-item"><a href="./example/component-2.html" target="_blank">component:组件-2 props</a></li>
            <li class="list-group-item"><a href="./example/component-3.html" target="_blank">component:组件-3 父子组件关系</a></li>
            <li class="list-group-item"><a href="./example/component-4.html" target="_blank">component:组件-4 components who</a></li>
        </ul>
        <hr>
        <h3>Vue选项</h3>
        <ul class="list-group">
            <li class="list-group-item"><a href="./example/propsdata.html" target="_blank">propsData Optin</a></li>
            <li class="list-group-item"><a href="./example/computed.html" target="_blank">computed Optin</a></li>
            <li class="list-group-item"><a href="./example/methods.html" target="_blank">methods Optin</a></li>
            <li class="list-group-item"><a href="./example/watch.html" target="_blank">watch Optin</a></li>
            <li class="list-group-item"><a href="./example/mixins.html" target="_blank">Mixins Optin</a></li>
            <li class="list-group-item"><a href="./example/extends.html" target="_blank">Extends Optin</a></li>
            <li class="list-group-item"><a href="./example/otherOption.html" target="_blank">Other Optin</a></li>
        </ul>
        <hr>
        <h3>Vue实例</h3>
        <ul class="list-group">
            <li class="list-group-item"><a href="./example/examples1.html" target="_blank">Early examples Demo-实例属性</a></li>
            <li class="list-group-item"><a href="./example/examples2.html" target="_blank">examples method Demo-实例方法</a></li>
            <li class="list-group-item"><a href="./example/examples3.html" target="_blank">examples Event Demo-实例事件</a></li>
        </ol>
        <hr>
        <h3>Vue内置组件</h3>
        <ul class="list-group">
            <li class="list-group-item"><a href="./example/solt.html" target="_blank">slot-组件的内容扩展</a></li>
            <li class="list-group-item"><a href="./example/vue-resource.html" target="_blank">vue-resource</a></li>
        </ul>
    </div>
</body>

</html>